<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <title>{% block title %}{% endblock %}</title>
  <!-- 样式 -->
  <link rel="stylesheet" href="{% static 'css/bootstrap.css' %}" >
  <link rel="stylesheet" href="{% static 'css/global.css' %}" >
  <link rel="stylesheet" href="{% static 'css/auth.css' %}">
  <link rel="stylesheet" href="{% static 'css/base.css' %}">
    <link rel="stylesheet" href="{% static 'css/iconfont.css' %}">
  {% block style %}{% endblock %}
</head>

<body>
  <!-- 导航 -->
  <div class="blog-masthead">
    <div class="container">
      <nav class="blog-nav">
        <a class="blog-nav-item blog-nav-item-first" href="{% url 'comment:index' %}">首页</a>
        <div class="blog-nav-item" href="#" id="categories">分类
          <ul class="categories">
              {% for classify in classifies %}
                <li><a href="{% url 'comment:index'%}?classify={{ classify.pk }}">{{classify.name}}</a></li>
              {% endfor %}
          </ul>
        </div>
        <a class="blog-nav-item" href="{% url 'comment:edit' %}">发布文章</a>
        {% if user.is_authenticated %}
          <a class="blog-nav-item pull-right" href="{% url 'blogauth:logout' %}">退出</a>
          <a class="blog-nav-item pull-right" href="/admin/">{{user.username}}</a>
        {% else %}
          <a class="blog-nav-item pull-right" href="javascript:void(0);"><span id="login-btn">登录</span> / <span id="register-btn">注册</span></a>
        {% endif %}
      </nav>
    </div>
  </div>
  <!-- 主体 -->
  <div class="container">
    {% block content %}{% endblock %}
  </div><!-- /.container -->

  <div class="mask">
    <div class="wrapper">
      <div class="main">
        <div class="main-item">
          <form class="form-content login-form">
            <div class="form-group form-title">
              <h2>登录</h2>
              <i class="iconfont icon-close"></i>
            </div>
            <div class="form-group">
              <input type="text" name="username" class="form-control" placeholder="请输入用户名">
            </div>
            <div class="form-group">
              <input type="password" name="password" class="form-control" placeholder="请输入密码">
            </div>

            <div class="form-group">
              <button class="form-control login-submit-btn">
                <span class="login-sumbit-span">登录</span>
                <span id="login-loading"></span>
              </button>
              <span class="pull-right switch">去注册</span>
            </div>
          </form>
        </div>

        <div class="main-item">
          <form action="" class="form-content register-form">
            <div class="form-group form-title">
              <h2>注册</h2>
              <i class="iconfont icon-close"></i>
            </div>
            <div class="form-group">
              <input type="text" class="form-control" placeholder="请输入用户名" name="username">
            </div>
            <div class="form-group">

              <input type="password" class="form-control" placeholder="请输入密码" name="password1">
            </div>
            <div class="form-group">

              <input type="password" class="form-control" placeholder="请再次输入密码" name="password2">
            </div>
            <div class="form-group">
              <button class="form-control register-submit-btn">
                <span class="register-sumbit-span">注册</span>
                <span id="register-loading"></span>
              </button>
              <span class="pull-right switch">去登录</span>
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>

  <!-- jquery -->
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script src="{% static 'js/nav.js'%}"></script>
  <script src="{% static 'js/message.js' %}"></script>
  <script src="{% static 'js/bootstrap.min.js' %}"></script>
  <script src="{% static 'js/auth.js' %}"></script>
  {% block script %}{% endblock %}
</body>

</html>